<template>
  <el-table class="space_table" :data="tableData" header-cell-class-name="table_head" stripe border height="500">
    <template #empty>
      <div>
        <el-empty description="这里暂时什么都没有" />
      </div>
    </template>
    <el-table-column label="序号" fixed type="index" width="60" class-name="sort-num" />

    <el-table-column prop="quotaType" fixed show-overflow-tooltip label="工程项目名称" width="200">
      <template #default="{ row }">
        <div :style="row.exchangeTag ? 'padding-left: 20px' : ''">
          <span class="change_tag">
            <img v-if="row.exchangeTag === 1" class="tag_image" src="@/assets/images/refund.png" />
            <img v-if="row.exchangeTag === 2" class="tag_image" src="@/assets/images/exchange.png" />
            <img v-if="row.exchangeTag === 3" class="tag_image" src="@/assets/images/supply.png" />
          </span>
          <div class="product-name-wrap">
            <img
              class="mr10"
              v-if="row.isCustom === 1"
              src="@/assets/images/custom-icon2.png"
              width="50"
              height="43"
              alt=""
              @click="toProdDetail(row)"
            />
            <div class="tetx-over" style="width: calc(100% - 50px)">
              <el-input
                maxlength="20"
                v-if="row.quotaType === 3 && canEdit"
                v-model="row.quotaName"
                placeholder="请输入"
                @change="updateCustomerSpaceQuotaFun(row)"
              />
              <div
                v-else
                :class="{ 'jzt-cursor-point': row.isCustom === 1 }"
                style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis"
                @click="row.isCustom === 1 ? toProdDetail(row) : () => {}"
              >
                {{ row.quotaName || "-" }}
              </div>
              <div v-if="row.showSign === 1" :class="quotaTypeList[row.quotaType - 1]?.class">
                {{ quotaTypeList[row.quotaType - 1]?.text }}
              </div>
            </div>
          </div>
        </div>
      </template>
    </el-table-column>
    <el-table-column
      prop="quotaType"
      v-if="currTempObj.softDecorationStatus === 1"
      show-overflow-tooltip
      label="分类"
      width="100"
    >
      <template #default="{ row }">
        <span>{{ row.categoryName || "-" }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="bindNames" v-if="currTempObj.softDecorationStatus === 1" label="图片" width="140">
      <template #default="{ row }">
        <img v-if="row.picUrls" :src="row.picUrls?.split(',')[0]" alt="" width="100" />
        <span v-else>-</span>
      </template>
    </el-table-column>
    <el-table-column prop="standardDesc" v-else show-overflow-tooltip label="工艺材料及说明" width="140">
      <template #default="{ row }">
        <span class="column_tag_a" @click="openDescribeDialog(row)">
          {{ row.standardDesc || "-" }}
        </span>
      </template>
    </el-table-column>
    <el-table-column prop="bindNames" label="品牌" width="140">
      <template #default="{ row }">
        <el-input
          v-if="row.quotaType === 3 && canEdit"
          v-model="row.bindNames"
          placeholder="请输入"
          @change="updateCustomerSpaceQuotaFun(row)"
        />
        <span v-else>{{ row.bindNames || "-" }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="modelNames" show-overflow-tooltip label="型号" width="120">
      <template #default="{ row }">
        <el-input
          v-if="row.quotaType === 3 && canEdit"
          v-model="row.modelNames"
          placeholder="请输入"
          @change="updateCustomerSpaceQuotaFun(row)"
        />
        <span v-else>{{ row.modelNames || "-" }}</span>
      </template>
    </el-table-column>
    <el-table-column
      prop="quotaType"
      v-if="currTempObj.softDecorationStatus === 1"
      show-overflow-tooltip
      label="商品规格"
      width="100"
    >
      <template #default="{ row }">
        <span>{{ row.skuSpecification || "-" }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="projectVal" label="预算工程量" width="120">
      <template #default="{ row }">
        <el-input
          v-if="canEdit"
          placeholder="请输入"
          v-model="row.projectVal"
          oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
          @change="updateCustomerSpaceQuotaFun(row, 'projectVal', { max: 999999 })"
        />
        <span v-else>{{ row.projectVal }}</span>
        <!-- 耗损率显示成一列但不显示列，套餐的时候，在此处显示 -->
        <p
          v-if="budgetDetail.isShowLost === 1 && budgetDetail.budgetType === 2 && !(currTempObj.softDecorationStatus === 1)"
          class="f12"
        >
          耗损率：{{ row.lostRate }}%
        </p>
      </template>
    </el-table-column>
    <el-table-column prop="limitProjectVal" label="限制工程数量" v-if="budgetDetail.budgetType === 2" width="120">
      <template #default="{ row }">
        <p>{{ budgetDetail.limitProjectValConfig === 1 ? row.limitProjectVal : "不限制工程数量" }}</p>
      </template>
    </el-table-column>
    <el-table-column prop="unit" label="单位" width="120">
      <template #default="{ row }">
        <el-select
          v-if="row.quotaType === 3 && canEdit"
          v-model="row.unit"
          placeholder="请选择"
          @change="updateCustomerSpaceQuotaFun(row)"
        >
          <el-option v-for="item in unitList" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue" />
        </el-select>
        <span v-else>
          {{ useCodeArrStore().getDictName("shop_unit", row.unit) || "-" }}
        </span>
      </template>
    </el-table-column>
    <el-table-column
      v-if="(budgetDetail.isShowLost & budgetDetail.budgetType) === 1 && !(currTempObj.softDecorationStatus === 1)"
      prop="lostRate"
      label="耗损率"
      width="120"
    >
      <template #default="{ row }">
        <el-input
          v-if="canEdit"
          placeholder="请输入"
          v-model="row.lostRate"
          oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
          @change="updateCustomerSpaceQuotaFun(row)"
        >
          <template #suffix>%</template>
        </el-input>
        <span v-else>
          {{ (row.lostRate || "") + "%" || "-" }}
        </span>
      </template>
    </el-table-column>

    <el-table-column prop="unitTotalMoney" label="单价" v-if="budgetDetail.budgetType === 1" width="130">
      <template #default="{ row }">
        <!-- 可输入 -->
        <el-input
          v-if="row.availuableUnitTotalFee === 1 && canEdit"
          placeholder="请输入"
          v-model="row.unitTotalMoney"
          oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
          @change="
            updateCustomerSpaceQuotaFun(
              row,
              'unitTotalMoney',
              {
                max: 999999999,
                min:
                  row.priceFlag === 1
                    ? Number(budgetDetail.regularDiscount) > 0
                      ? (Number(budgetDetail.regularDiscount) / 100) * Number(row.origPrice)
                      : 0
                    : row.priceFlag === 2
                      ? Number(budgetDetail.specialDiscount) > 0
                        ? (Number(budgetDetail.specialDiscount) / 100) * Number(row.origPrice)
                        : 0
                      : 0
              },
              row.priceFlag
            )
          "
        >
          <template #prefix>¥</template>
        </el-input>

        <p v-else>¥{{ row.unitTotalMoney }}</p>
      </template>
    </el-table-column>
    <el-table-column
      prop="unitTotalMoney"
      label="单价"
      v-if="budgetDetail.budgetType === 2"
      :width="currTempObj.softDecorationStatus === 1 ? 220 : 380"
    >
      <template #default="{ row }">
        <img v-if="row.additionalStatus === 1" class="type_icon" src="@/assets/images/taocan-add.png" />
        <template v-if="row.quotaType === 3 && canEdit">
          <span
            :class="row.additionalStatus === 1 ? 'pl60' : ''"
            :style="`color: ${row.unitTotalMoney > 0 ? '#ff3333' : '#86909c'}`"
            style="display: inline-block"
            >¥{{ row.unitTotalMoney }}</span
          >
          <el-input
            class="mb4"
            placeholder="主材报价总额"
            v-model="row.mainQuoteMoney"
            oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
            @change="updateCustomerSpaceQuotaFun(row, 'mainQuoteMoney', { max: 999999999 })"
          >
            <template #prefix>主材：¥</template>
          </el-input>

          <el-input
            v-if="!(currTempObj.softDecorationStatus === 1)"
            class="mb4"
            placeholder="辅材报价总额"
            v-model="row.auxiliaryQuoteMoney"
            oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
            @change="updateCustomerSpaceQuotaFun(row, 'auxiliaryQuoteMoney', { max: 999999999 })"
          >
            <template #prefix>辅材：¥</template>
          </el-input>

          <el-input
            v-if="!(currTempObj.softDecorationStatus === 1)"
            placeholder="人工报价总额"
            v-model="row.workerQuoteMoney"
            oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
            @change="updateCustomerSpaceQuotaFun(row)"
          >
            <template #prefix>人工：¥</template>
          </el-input>
        </template>
        <template v-else-if="row.quotaType === 8 && canEdit && row.availuableUnitTotalFee === 1 && row.canEditUnitPrice === 1">
          <el-input
            :class="row.additionalStatus === 1 ? 'pl60' : ''"
            placeholder="请输入"
            v-model="row.unitTotalMoney"
            oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
            @change="
              updateCustomerSpaceQuotaFun(
                row,
                'unitTotalMoney',
                {
                  max: 999999999,
                  min:
                    row.priceFlag === 1
                      ? Number(budgetDetail.regularDiscount) > 0
                        ? (Number(budgetDetail.regularDiscount) / 100) * Number(row.origPrice)
                        : 0
                      : row.priceFlag === 2
                        ? Number(budgetDetail.specialDiscount) > 0
                          ? (Number(budgetDetail.specialDiscount) / 100) * Number(row.origPrice)
                          : 0
                        : 0
                },
                row.priceFlag
              )
            "
            style="width: 160px"
          >
            <template #prefix>¥</template>
          </el-input>
        </template>
        <div v-else>
          <p
            :class="row.additionalStatus === 1 ? 'pl60' : ''"
            :style="`color: ${row.unitTotalMoney > 0 ? '#ff3333' : '#86909c'}`"
            style="display: inline-block"
          >
            ¥{{ row.unitTotalMoney }}
          </p>
          <div :class="row.additionalStatus === 1 ? 'pl50' : ''" style="display: flex; align-items: center">
            <div
              v-if="budgetDetail.isShowMainProduct === 1"
              class="ml10"
              :class="{ column_tag_a: row.mainProductShowType !== null }"
              @click="row.mainProductShowType !== null ? openMaterialDialog(row, 1) : () => {}"
            >
              <i class="dot-icon" v-if="row.mainAdditionalStatus === 1"></i>
              主材（{{ row.mainProductNum }}）
            </div>
            <div
              v-if="!(currTempObj.softDecorationStatus === 1)"
              class="ml10"
              :class="{ column_tag_a: row.auxiliaryProductShowType !== null }"
              @click="row.auxiliaryProductShowType !== null ? openMaterialDialog(row, 2) : () => {}"
            >
              <i class="dot-icon" v-if="row.auxiliaryAdditionalStatus === 1"></i>
              辅材（{{ row.auxiliaryProductNum }}）
            </div>
            <div
              v-if="!(currTempObj.softDecorationStatus === 1)"
              class="ml10"
              :class="{ column_tag_a: row.workerItemNum !== 0 }"
              @click="row.workerItemNum !== 0 ? openArtificialDialog(row) : () => {}"
            >
              人工（{{ row.workerNum }}）
            </div>
          </div>
        </div>
      </template>
    </el-table-column>
    <el-table-column label="材料费" width="200" v-if="budgetDetail.budgetType === 1" align="center">
      <el-table-column
        label="主材及软装其他"
        header-align="center"
        v-if="budgetDetail.isShowMainProduct === 1"
        prop="mainQuoteMoney"
        width="190"
      >
        <template #default="{ row }">
          <template v-if="row.additionalStatus === 1 && row.mainAdditionalStatus === 1">
            <img v-if="row.mainProductShowType === 1" class="type_icon" src="@/assets/images/guding-add.png" width="80" />
            <img v-if="row.mainProductShowType === 2" class="type_icon" src="@/assets/images/zuhe-add.png" width="80" />
          </template>
          <template v-else>
            <img v-if="row.mainProductShowType === 2" class="type_icon" src="@/assets/images/zuhe-icon.png" />
            <img v-if="row.mainProductShowType === 1" class="type_icon" src="@/assets/images/guding-icon.png" />
          </template>

          <div v-if="row.availuableMainProductFee === 1 && canEdit && row.canEditUnitPrice === 1" class="jzt-flex-center">
            <el-input
              v-model="row.mainQuoteMoney"
              placeholder="请输入"
              oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
              @change="updateCustomerSpaceQuotaFun(row, 'mainQuoteMoney', { max: 999999999 })"
              style="width: 90px"
            >
              <template #prefix>¥</template>
            </el-input>
          </div>
          <div v-else :class="row.additionalStatus === 1 && row.mainAdditionalStatus === 1 ? 'pl60' : 'jzt-text-center'">
            <div
              class="column_tag_a"
              v-if="[1, 6].includes(row.quotaType) && row.mainProductShowType !== null"
              @click="openMaterialDialog(row, 1)"
            >
              ¥{{ row.mainQuoteMoney || "-" }}
            </div>
            <div v-else>¥{{ row.mainQuoteMoney || "-" }}</div>
            <!-- 增减项 -->
            <span :class="row.mainChangeMoney < 0 ? 'yellow_text' : 'green_text'"> ¥{{ row.mainChangeMoney || "-" }} </span>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="辅材" v-if="!(currTempObj.softDecorationStatus === 1)" prop="auxiliaryQuoteMoney" width="190">
        <template #default="{ row }">
          <template v-if="row.additionalStatus === 1 && row.auxiliaryAdditionalStatus === 1">
            <img v-if="row.auxiliaryProductShowType === 1" class="type_icon" src="@/assets/images/guding-add.png" width="80" />
            <img v-if="row.auxiliaryProductShowType === 2" class="type_icon" src="@/assets/images/zuhe-add.png" width="80" />
          </template>
          <template v-else>
            <img v-if="row.auxiliaryProductShowType === 2" class="type_icon" src="@/assets/images/zuhe-icon.png" />
            <img v-if="row.auxiliaryProductShowType === 1" class="type_icon" src="@/assets/images/guding-icon.png" />
          </template>
          <!-- 可输入 -->
          <div v-if="row.availuableAuxiliaryQuoteFee === 1 && canEdit && row.canEditUnitPrice === 1" class="jzt-flex-center">
            <el-input
              v-model="row.auxiliaryQuoteMoney"
              placeholder="请输入"
              oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
              @change="updateCustomerSpaceQuotaFun(row, 'auxiliaryQuoteMoney', { max: 999999999 })"
              style="width: 90px"
            >
              <template #prefix>¥</template>
            </el-input>
          </div>
          <div v-else :class="row.additionalStatus === 1 && row.auxiliaryAdditionalStatus === 1 ? 'pl60' : 'jzt-text-center'">
            <div
              class="column_tag_a"
              v-if="[1, 6].includes(row.quotaType) && row.auxiliaryProductShowType !== null"
              @click="openMaterialDialog(row, 2)"
            >
              ¥{{ row.auxiliaryQuoteMoney || "-" }}
            </div>
            <p v-else>¥{{ row.auxiliaryQuoteMoney || "-" }}</p>
            <!-- 增减项 -->
            <span :class="row.auxiliaryChangeMoney < 0 ? 'yellow_text' : 'green_text'">
              ¥{{ row.auxiliaryChangeMoney || "-" }}
            </span>
          </div>
        </template>
      </el-table-column>
    </el-table-column>
    <el-table-column
      prop="workerQuoteMoney"
      label="人工费"
      v-if="budgetDetail.budgetType === 1 && !(currTempObj.softDecorationStatus === 1)"
      width="110"
    >
      <template #default="{ row }">
        <template v-if="row.availuableWorkerFee === 1 && canEdit && !(row.quotaType === 4 || row.quotaType === 5)">
          <el-input v-model="row.workerQuoteMoney" placeholder="请输入" @change="updateCustomerSpaceQuotaFun(row)">
            <template #prefix>¥</template>
          </el-input>
        </template>
        <template v-else>
          <div
            v-if="[1, 6].includes(row.quotaType) && row.workerItemNum !== 0"
            class="column_tag_a"
            @click="openArtificialDialog(row)"
          >
            ¥{{ row.workerQuoteMoney || "-" }}
          </div>
          <p v-else>¥{{ row.workerQuoteMoney || "-" }}</p>
        </template>
      </template>
    </el-table-column>

    <el-table-column prop="projectTotalMoney" label="合计">
      <template #header>
        合计
        <el-tooltip class="box-item" effect="dark" content="合计=预算工程量*(主材费+辅料费+人工费)*(1+损耗率)" placement="top">
          <el-button type="primary" link>
            <el-icon style="color: #909399"><QuestionFilled /></el-icon>
          </el-button>
        </el-tooltip>
      </template>
    </el-table-column>
    <!-- <el-table-column prop="warrantyTime" label="商品质保日期(月)" width="90">
      <template #default="{ row }">
        <p v-if="row.quotaType == 4 || row.quotaType == 8">{{ row.warrantyTime }}</p>
        <span v-else-if="row.quotaType == 6 || row.quotaType == 1">0</span>
        <span v-else>-</span>
      </template>
    </el-table-column> -->
    <el-table-column prop="remark" label="备注" width="280">
      <template #default="{ row }">
        <RemarkEditor v-model="row.remark" title="修改备注" :isEdit="true" @submit="updateCustomerSpaceQuotaFun(row)" />
      </template>
    </el-table-column>
    <el-table-column v-if="canEdit" fixed="right" label="操作" width="80">
      <template #default="{ row }">
        <el-button type="danger" link @click="deleteSpaceQuotaFun(row)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>

  <ActionSubmitDialog
    v-model:isOpen="deleteDialogFlag"
    :title="'提醒'"
    :message="'您正在删除工程项目，请问是否继续当前操作？'"
    :submitBtnText="'继续'"
    @submit="deleteRowData"
  />

  <cailiaoDetailList
    v-model:isOpen="materialDialogFlag"
    :canEdit="canEdit"
    :optionInfo="optionInfoMaterial"
    @submitOk="emits('success')"
  />

  <materialDrawer
    v-model:isOpen="describeDialogFlag"
    :canEdit="canEdit"
    :optionInfo="optionInfoDescribe"
    @submitOk="emits('success')"
  />

  <artificialDetailList
    v-model:isOpen="artificialDialogFlag"
    :canEdit="canEdit"
    :optionInfo="optionInfoArtificial"
    @submitOk="emits('success')"
  />
</template>
<script setup>
import useCodeArrStore from "@/store/modules/select";
import {
  updateCustomerSpaceQuota,
  deleteSpaceQuota,
  packageMainMaterial,
  getMainProductsByContentId,
  getAuxiliaryProductsByContentId,
  getWorkerListByContentId,
  getProductByBudget
} from "@/apis/quote-price/following";
import { ref, nextTick, inject } from "vue";
import { ElMessage } from "element-plus";
import ActionSubmitDialog from "@/components/ActionSubmitDialog";
import cailiaoDetailList from "./cailiaoDetailList.vue";
import materialDrawer from "./materialDetail.vue";
import artificialDetailList from "./artificialDetailList.vue";
import RemarkEditor from "@/components/RemarkEditor";

const currTempObj = ref(inject("currTemp")); //祖级传递过来的当前模板obj

const quotaTypeList = [
  { text: "常规定额", class: "yellow_text" },
  { text: "虚拟定额", class: "yellow_text" },
  { text: "自定义定额", class: "yellow_text" },
  { text: "新增主材", class: "green_text" },
  { text: "新增辅材", class: "green_text" },
  { text: "新增定额", class: "green_text" },
  { text: "个性化定额", class: "green_text" },
  { text: "个性化材料", class: "yellow_text" }
];

const unitList = ref(useCodeArrStore().getDict("shop_unit", "num"));

const props = defineProps({
  tableData: { type: Array, default: () => [] },
  budgetDetail: { type: Object, default: () => ({}) },
  canEdit: { type: Boolean, default: false }
});

const emits = defineEmits(["success"]);

const deleteDialogFlag = ref(false);
const currentRow = ref({});
const materialDialogFlag = ref(false);
const optionInfoMaterial = ref({ detail: {} });
const describeDialogFlag = ref(false);
const optionInfoDescribe = ref({ detail: {} });
const artificialDialogFlag = ref(false);
const optionInfoArtificial = ref({ detail: {} });

const toProdDetail = row => {
  console.log("跳转到商品详情页===", row);
  getProductByBudget({ contentId: row.contentId }).then(res => {
    if (res.code === 200) {
      const baseRouter = window.microApp.router.getBaseAppRouter();
      const routeUrl = baseRouter.resolve({
        path: "/designer/shopDetail/index",
        query: { id: res.data }
      });
      window.open(routeUrl.href, "_blank");
    }
  });
};

//限制数字输入框的最大值
const numberChange = (row, key, val, minNum, maxNum, priceFlag) => {
  console.log("最小值", minNum);
  console.log("最大值", maxNum);
  //转换数字类型
  row[key] = Number(val).toFixed(2);
  //重新渲染
  nextTick(() => {
    //比较输入的值和最大值，返回小的
    let num = Math.min(Number(val), maxNum);
    console.log(val, num);

    //输入负值的情况下， = 0（可根据实际需求更该）
    if (num < 0) {
      row[key] = 0;
    } else {
      //反之
      row[key] = num.toFixed(2);
    }

    //单价，手动输入时，受正价折扣、特价折扣的影响（不能小于折扣范围）
    if (Number(val) < Number(minNum) && key === "unitTotalMoney") {
      const msg = `当前商品为${row["origPrice"]}${priceFlag === 1 ? "正价" : priceFlag === 2 ? "特价" : ""}，限制折扣为${priceFlag === 1 ? props.budgetDetail.regularDiscount : priceFlag === 2 ? props.budgetDetail.specialDiscount : "0"}%，只能在此范围内进行改价~！`;
      ElMessage({ message: msg, type: "warning" });
      row[key] = Number(minNum).toFixed(2);
    }
  });
};

/**
 *
 * @param item
 * @param key
 * @param limit
 * @param priceFlag 1:正价 2：特价 3:指定价格
 */
const updateCustomerSpaceQuotaFun = async (item, key, limit = { max: 999999, min: 0 }, priceFlag) => {
  console.log("最大值", limit.max);
  if (key) numberChange(item, key, item[key], limit.min, limit.max, priceFlag); //限制数字输入框的最大值
  if (item.lostRate > 100 || item.lostRate < 0) {
    ElMessage({ message: "耗损率必须大于0小于100", type: "error" });
    return;
  }

  nextTick(async () => {
    const { code } = await updateCustomerSpaceQuota({ ...item });
    code === 200 && emits("success", "修改成功", true);
  });
};

const deleteSpaceQuotaFun = item => {
  currentRow.value = item;
  deleteDialogFlag.value = true;
};

const deleteRowData = async () => {
  const { code } = await deleteSpaceQuota({ contentId: currentRow.value.contentId });
  if (code === 200) {
    deleteDialogFlag.value = false;
    emits("success", "删除成功");
  }
};

const openMaterialDialog = async (item, type = 1) => {
  materialDialogFlag.value = true;
  await getProductsByContentIdFun(item, type);
};

const getProductsByContentIdFun = async (item, type = 1, code) => {
  let res = { data: {} };

  optionInfoMaterial.value.currTempObj = { budgetType: props.budgetDetail.budgetType }; //选中的模板obj
  optionInfoMaterial.value.dialogType = "ys"; //ys-预算报价  de-定额模板
  optionInfoMaterial.value.actionType = props.canEdit ? "edit" : "view";
  optionInfoMaterial.value.project = { ...item };
  optionInfoMaterial.value.type = type === 1 ? "zhu" : "fu";
  optionInfoMaterial.value.getDetailList = getProductsByContentIdFun;

  if ((type === 1 && item.mainProductShowType === 2) || (type === 2 && item.auxiliaryProductShowType === 2)) {
    //主材mainProductShowType 辅材auxiliaryProductShowType :1-具体商品 2-条件组合

    res = await packageMainMaterial({
      productType: type, //1-主材 2-辅材材
      budgetId: props.budgetDetail.budgetId,
      contentId: item.contentId,
      code
    });
  } else if ((type === 1 && item.mainProductShowType === 1) || (type === 2 && item.auxiliaryProductShowType === 1)) {
    //非条件组合
    if (type === 1) {
      //主材明细
      res = await getMainProductsByContentId({ contentId: item.contentId });
    } else {
      //辅材明细
      res = await getAuxiliaryProductsByContentId({ contentId: item.contentId });
    }
  }

  optionInfoMaterial.value.detail = { ...res.data, contentId: item.contentId, _time: new Date().getTime() };
};

const openDescribeDialog = item => {
  if (!props.canEdit) {
    optionInfoDescribe.value.type = "view";
  } else {
    optionInfoDescribe.value.type = item.canEditStandard === 1 ? "edit" : item.canEditStandard === 0 ? "view" : "edit";
  }
  optionInfoDescribe.value.detail = { ...item, _time: new Date().getTime() };
  describeDialogFlag.value = true;
};

const openArtificialDialog = async item => {
  await getWorkerListByContentIdFun(item);
  artificialDialogFlag.value = true;
};

const getWorkerListByContentIdFun = async item => {
  const { code, data } = await getWorkerListByContentId({ contentId: item.contentId });
  if (code === 200) {
    optionInfoArtificial.value.currTempObj = { budgetType: props.budgetDetail.budgetType };
    optionInfoArtificial.value.dialogType = "ys";
    optionInfoArtificial.value.actionType = props.canEdit ? "edit" : "view";
    optionInfoArtificial.value.detail = { ...data, contentId: item.contentId, _time: new Date().getTime() };
  }
};
</script>
<style lang="scss" scoped>
.product-name-wrap {
  display: flex;
  align-items: center;
}
.dot-icon {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: linear-gradient(270deg, #007dff 0%, #83c0ff 99%);
  margin-right: 4px;
}
:deep(.sort-num) {
  & > .cell {
    line-height: 64px;
  }
}
.space_table {
  .type_icon {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
  }
  .column_tag_a {
    text-decoration: underline;
    cursor: pointer;
  }
  .yellow_text {
    font-size: 12px;
    color: #ffaa00;
  }
  .green_text {
    font-size: 12px;
    color: #51cb53;
  }
  .change_tag {
    float: left;
    position: absolute;
    top: 0;
    left: 0;
    .tag_image {
      position: absolute;
    }
  }
}
</style>
